  <template>
  <div>
<my-table :list="list">.
  <template v-slot:title>
    <h1>品牌列表</h1>
  </template>

  <template v-slot:index="{index}">
    <h2 v-color="'red'">{{index}}</h2>
  </template>

  <template v-slot:goodsName="scope">
    <h2>{{scope.goodsName}}</h2>
  </template>

<template v-slot:price="scope">
    <h2>{{scope.price}}</h2>
  </template>

  <template v-slot:time="scope">
    <h2>{{scope.time}}</h2>
  </template>

  <template v-slot:action>
    <h2><a href="javascipt:;">删除</a></h2>
  </template>

</my-table>
  </div>
</template>

<script>
import MyTable from './components/myTable.vue'
export default {
  components: { MyTable },
  data () {
    return {
      list: [
        { id: 100, name: '外套', price: 199, time: new Date('2010-08-12') },
        { id: 101, name: '裤子', price: 34, time: new Date('2013-09-01') },
        { id: 102, name: '鞋', price: 25.4, time: new Date('2018-11-22') },
        { id: 103, name: '头发', price: 19900, time: new Date('2020-12-12') }
      ]
    }
  },

  created () {

  },

  methods: {

  }
}
</script>

<style scoped lang='less'>

</style>
